<template>
	<view style="height: 44px;border-radius: 22px;overflow: hidden;border-color: #ffffff;border-width: 1px;border-style: solid;padding-left: 20px;background-color: #ffffff60;">
		<input @focus="focusHandle" 
		@blur="blurHandle"
		:disabled="disable" @touchend="clickHandle" :type="type" :value="value"
		 @input="valueInputHandle"
		 :placeholder="placeholder" style="flex: 1;display: block;height: 44px;" />
	</view>
</template>

<script>
	export default {
		name:"TextTF",
		props:{
			type:{
				type:String,
				default:"text"
			},
			placeholder:{
				type:String,
				default:"placeholder",
			},
			disable:{
				type:Boolean,
				default:false,
			},
			value:{
				type:String
			}
		},
		data() {
			return {
				
			};
		},
		methods:{
			clickHandle(e){
				this.$emit("click")
			},
			valueInputHandle(e) {
				this.$emit("input", e.target.value);
			},
			focusHandle(){
				this.$emit("focus");
			},
			blurHandle(){
				this.$emit("blur");
			},
		}
	}
</script>

<style>

</style>